{extends "../@layout.xml"}

{block title}{_photo}{/block}

{block header}
    {ifset $album}
        <a href="{$album->getOwner()->getURL()}">
            {$album->getOwner()->getCanonicalName()}
        </a>
        {if ($album->getOwner() instanceof openvk\Web\Models\Entities\Club)}
            » <a href="/albums{$album->getOwner()->getId() * -1}">{_albums}</a>
        {else}
            » <a href="/albums{$album->getOwner()->getId()}">{_albums}</a>
        {/if}
        » <a href="/album{$album->getPrettyId()}">{$album->getName()}</a>
    {else}
        <a href="{$photo->getOwner()->getURL()}">{$photo->getOwner()->getCanonicalName()}</a>
    {/ifset}
    » {_photo}
{/block}

{block content}
    <center style="margin-bottom: 8pt;">
        <img src="{$photo->getURLBySizeId('large')}" style="max-width: 80%; max-height: 60vh;" />
    </center>
    
    <hr/>
    
    <div style="width: 100%; min-height: 100px;" class="ovk-photo-details">
        <div style="float: left; min-height: 100px; width: 68%;margin-left: 3px;">
            {include "../components/comments.xml", comments => $comments, count => $cCount, page => $cPage, model => "photos", parent => $photo, custom_id => 999}
        </div>
        <div style="float:right;min-height: 100px;width: 30%;margin-left: 1px;">
            <div>
                <h4>{_information}</h4>
                <span style="color: grey;">{_info_description}:</span>
                {$photo->getDescription() ?? "(" . tr("none") . ")"}<br/>
                <span style="color: grey;">{_info_uploaded_by}:</span>
                <a href="{$photo->getOwner()->getURL()}">{$photo->getOwner()->getFullName()}</a><br/>
                <span style="color: grey;">{_info_upload_date}:</span>
                {$photo->getPublicationTime()}
            </div>
            <br/>
            <h4>{_actions}</h4>
            {if isset($thisUser) && $thisUser->getId() != $photo->getOwner()->getId()}
                {var canReport = true}
            {/if}
            <div n:if="isset($thisUser) && $thisUser->getId() === $photo->getOwner()->getId()">
                <a href="/photo{$photo->getPrettyId()}/edit" class="profile_link" style="display:block;width:96%;">{_edit}</a>
                <a id="_photoDelete" href="/photo{$photo->getPrettyId()}/delete" class="profile_link" style="display:block;width:96%;">{_delete}</a>
            </div>
            <a href="{$photo->getURL()}" class="profile_link" target="_blank" style="display:block;width:96%;">{_"open_original"}</a>
            <a n:if="$canReport ?? false" class="profile_link" style="display:block;width:96%;" href="javascript:reportPhoto()">{_report}</a>
            <script n:if="$canReport ?? false">
                function reportPhoto() {
                uReportMsgTxt  = tr("going_to_report_photo");
                uReportMsgTxt += "<br/>"+tr("report_question_text");
                uReportMsgTxt += "<br/><br/><b>"+tr("report_reason")+"</b>: <input type='text' id='uReportMsgInput' placeholder='" + tr("reason") + "' />"

                MessageBox(tr("report_question"), uReportMsgTxt, [tr("confirm_m"), tr("cancel")], [
                    (function() {
                        res = document.querySelector("#uReportMsgInput").value;
                        xhr = new XMLHttpRequest();
                        xhr.open("GET", "/report/" + {$photo->getId()} + "?reason=" + res + "&type=photo", true);
                        xhr.onload = (function() {
                        if(xhr.responseText.indexOf("reason") === -1)
                            MessageBox(tr("error"), tr("error_sending_report"), ["OK"], [Function.noop]);
                        else
                            MessageBox(tr("action_successfully"), tr("will_be_watched"), ["OK"], [Function.noop]);
                        });
                        xhr.send(null);
                        }),
                    Function.noop
                ]);
                }
            </script>
        </div>
    </div>
{/block}
